{% extends 'auth/base.html' %}
{% block title %}用户注册{% endblock %}
{% block imgText %}用户注册{% endblock %}
{% block imgStyle %}-mt-[4.2rem]{% endblock %}
{% block dataForm %}
    <form class="flex flex-col w-80">
        {{ register_form.csrf_token() }}
        <label class="input input-bordered flex items-center gap-2">
            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="currentColor"
                 class="h-4 w-4 opacity-70">
                <path d="M8 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6ZM12.735 14c.618 0 1.093-.561.872-1.139a6.002 6.002 0 0 0-11.215 0c-.22.578.254 1.139.872 1.139h9.47Z"/>
            </svg>
            {{ register_form.username(class='grow', placeholder=register_form.username.label.text) }}
        </label>

        <label class="input input-bordered flex items-center gap-2 my-3">
            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="currentColor"
                 class="h-4 w-4 opacity-70">
                <path fill-rule="evenodd"
                      d="M14 6a4 4 0 0 1-4.899 3.899l-1.955 1.955a.5.5 0 0 1-.353.146H5v1.5a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1-.5-.5v-2.293a.5.5 0 0 1 .146-.353l3.955-3.955A4 4 0 1 1 14 6Zm-4-2a.75.75 0 0 0 0 1.5.5.5 0 0 1 .5.5.75.75 0 0 0 1.5 0 2 2 0 0 0-2-2Z"
                      clip-rule="evenodd"/>
            </svg>
            {{ register_form.password(class='grow', placeholder=register_form.password.label.text) }}
        </label>

        <label class="input input-bordered flex items-center gap-2">
            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="currentColor"
                 class="h-4 w-4 opacity-70">
                <path fill-rule="evenodd"
                      d="M14 6a4 4 0 0 1-4.899 3.899l-1.955 1.955a.5.5 0 0 1-.353.146H5v1.5a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1-.5-.5v-2.293a.5.5 0 0 1 .146-.353l3.955-3.955A4 4 0 1 1 14 6Zm-4-2a.75.75 0 0 0 0 1.5.5.5 0 0 1 .5.5.75.75 0 0 0 1.5 0 2 2 0 0 0-2-2Z"
                      clip-rule="evenodd"/>
            </svg>
            {{ register_form.password2(class='grow', placeholder=register_form.password2.label.text) }}
        </label>

        <div class="my-3 text-right"><a href="{{ url_for('auth.login') }}">返回登录</a></div>

        {{ register_form.submit(class='btn btn-outline btn-primary') }}
    </form>
{% endblock %}
{% block js %}
    <script>
        document.querySelector('form').addEventListener('submit', function (e) {
            e.preventDefault();
            let formData = new FormData(this);
            fetch('{{ url_for('auth.register') }}', {
                method: 'POST',
                body: formData
            }).then(response => response.json())
                .then(data => {
                    if (data.code === 200) {
                        successToast(data.msg)
                        setTimeout(() => {
                            window.location.href = "{{ url_for('auth.login') }}"
                        }, 2800)
                    } else {
                        if (isArray(data.msg)) {
                            for (let i = 0; i < data.msg.length; i++) {
                                errorToast(data.msg[i])
                            }
                        } else {
                            errorToast(data.msg)
                        }
                    }
                })
        })
    </script>
{% endblock %}